<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="../../resources/plantilla/AdminPlantilla.xhtml"
                xmlns:p="http://primefaces.org/ui"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:define name="content">
        <p:growl id="growl" showDetail="true" life="20000"/>
        <h:form id="crudOE">

            <h:panelGroup id="display">
                <p:toolbar styleClass="btn-toolbar" >

                    <f:facet name="left">
                        <p:commandButton id="buttonNuevo" icon="ui-icon-document"   
                                         value="Nuevo Objetivo" actionListener="#{objetivoEstrategicoController.init}" 
                                         rendered="#{objetivoEstrategicoController.switchObjetivo}"
                                         update="crudOE, :growl"/>
                        <p:commandButton id="buttonBuscar" icon="ui-icon-search"   
                                         value="Buscar Objetivo" actionListener="#{objetivoEstrategicoController.init}" 
                                         rendered="#{!objetivoEstrategicoController.switchObjetivo}"
                                         update="crudOE, :growl"/>
                        <span class="ui-separator">
                            <span class="ui-icon ui-icon-grip-dotted-vertical" />
                        </span>

                        <p:selectOneMenu id="selectOE" value="#{objetivoEstrategicoController.selected}" effect="blind" 
                                         rendered="#{objetivoEstrategicoController.switchObjetivo}">
                            <f:selectItem noSelectionOption="false"/>
                            <f:selectItems value="#{objetivoEstrategicoController.itemsAvailableSelectMany}"
                                           var="itemOE"
                                           itemValue="#{itemOE}"
                                           itemLabel="#{itemOE.objetivo}"/>
                            <f:converter binding="#{objetivoEstrategicoConverter}"/>
                            <p:ajax event="change"  
                                    listener="#{objetivoEstrategicoController.faceUpdateAll()}"
                                    update="crudOE, :growl"
                                    />
                        </p:selectOneMenu>
                    </f:facet>
                    <f:facet name="right">
                        <span class="ui-separator">
                            <span class="ui-icon ui-icon-grip-dotted-vertical" />
                        </span>
                        <p:commandButton id="buttonGuardar" icon="ui-icon-disk"   
                                         value="Guardar" actionListener="#{objetivoEstrategicoController.create}" 
                                         update="crudOE, :growl"/>

                        <span class="ui-separator">
                            <span class="ui-icon ui-icon-grip-dotted-vertical" />
                        </span>

                    </f:facet>
                </p:toolbar>
                <p:tabView dynamic="true" cache="true" id="tabView1">
                    <p:tab title="Objetivos Estrategicos" id="tabOE">

                        <ui:include src="Objetivo.xhtml"/>
                    </p:tab>
                    <p:tab title="Indicadores" id="tabIndicadores" rendered="#{objetivoEstrategicoController.selected!=null}">
                         <ui:include src="Indicador.xhtml"/>
                    </p:tab>
                </p:tabView>
            </h:panelGroup> 
        </h:form>
    </ui:define>
</ui:composition>

